<template>
	<view class="trends">
		<view class="load" v-if="!load" style="text-align:center;">
			<text>正在加载</text>
			<!-- <u-loading-icon mode="circle" inactive-color="#fff" text="正在加载..." vertical></u-loading-icon> -->
		</view>
		<block v-else>
			<!-- #ifdef MP-WEIXIN -->
			<x-scroll @onRefresh="onRefresh" :isNav="false" refresh="true" @scrolltolower="scrolltolower" offset="0"
				style="height: 100vh;">
				<!-- #endif -->
				<view class="week_share" v-if="action_list.length > 0"
					@click="nav_to(`/pages/dynamic/subject?id=${action_list[0].ID}`)">
					<view class="week_act">
						<view class="title">{{ action_list[0].Title }}
							<view class="desc">共有{{ action_list[0].Communities.length }}人已加入挑战</view>
						</view>
						<view class="title_right">加入挑战</view>
					</view>
				</view>

				<block v-if="Array.isArray(list) && list.length > 0">
					<view class="list" id="listArea">
						<view class="item" v-for="(item, index) in list" :key="index">
							<view class="item_hd wap" @click="nav_to(`/pages/user/user_visitor?id=${item.UserID}`)">
								<view class="left">
									<view class="cover">
										<image :src="item.HeadImgUrl" mode="aspectFill" />
									</view>

									<view class="item_name">{{ item.Name ? $util.entitiesToUtf16(item.Name) : '' }}
										<view class="f3 c3">{{ getYearStr(item.Birthday) }}后
										</view>
									</view>
								</view>

								<view class="f3 c3">{{ getTime(item.CreateTime) }}</view>
							</view>
							<view class="item_bd">

								<!-- <view class="f2 c2 conrem" v-if="item.PagePath!=''" @click="nav_to(`${item.PagePath}`)">
									<view class="">
										{{item.Content}}
									</view>
								</view> -->
								<view class="describe" v-if="item.Content">
									<text v-if="toggle" class="describetext">{{ $util.entitiesToUtf16(item.Content) }}</text>
									<text v-else class="describetext2">{{ $util.entitiesToUtf16(item.Content) }}</text>
									<!-- <view v-if="item.Content && item.Content.length > 38"
										:class="toggle ? 'expand' : 'retract'" @click="onexpand">
										<text class="expandtext">全文</text>
										<image v-if="toggle" class="expandimg"
											src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17105662490661328.png">
										</image>
										<image v-else class="expandimg"
											src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1711679435607517.png">
										</image>
									</view> -->
								</view>

								<!-- <view class="order_div" v-if="item.IsOpenOrder==1">
									<view class="order_btn" @click="order()">立即订场</view>
								</view> -->

								<view class="mt20" @click.stop="''" v-if="item.IsVideo === 0">
									<view class="one" @click.stop="lookimg(item.Images)"
										v-if="JSON.parse(item.Images).length == 1">
										<image class="simg"
											:src="JSON.parse(item.Images)[0] + '?x-oss-process=image/resize,m_fill,w_1500'"
											mode="widthFix" @click.stop="lookimg(item.Images, 0)" />
									</view>
									<view class="two" @click.stop="lookimg(item.Images)"
										v-else-if="JSON.parse(item.Images).length == 2">
										<view class="two-one" @click.stop="lookimg(item.Images, 0)">
											<image class="simg"
												:src="JSON.parse(item.Images)[0] + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" />
										</view>
										<view class="two-two">
											<image class="simg"
												:src="JSON.parse(item.Images)[1] + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" @click.stop="lookimg(item.Images, 1)" />
										</view>
									</view>
									<view class="three" @click.stop="lookimg(item.Images)"
										v-else-if="JSON.parse(item.Images).length == 3">
										<view class="three-one" @click.stop="lookimg(item.Images, 0)">
											<image class="simg"
												:src="JSON.parse(item.Images)[0] + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" />
										</view>
										<view class="three-two">
											<image class="simg"
												:src="JSON.parse(item.Images)[1] + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" @click.stop="lookimg(item.Images, 1)" />
											<image class="simg"
												:src="JSON.parse(item.Images)[2] + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" @click.stop="lookimg(item.Images, 2)" />
										</view>
									</view>
									<view class="four" @click.stop="lookimg(item.Images)"
										v-else-if="JSON.parse(item.Images).length == 4">
										<view class="four-one">
											<view class="four-one-one" @click.stop="lookimg(item.Images, 0)">
												<image class="simg"
													:src="JSON.parse(item.Images)[0] + '?x-oss-process=image/resize,m_fill,w_1500'"
													mode="aspectFill" />
											</view>
											<view class="four-one-two" @click.stop="lookimg(item.Images, 1)">
												<image class="simg"
													:src="JSON.parse(item.Images)[1] + '?x-oss-process=image/resize,m_fill,w_1500'"
													mode="aspectFill" />
											</view>
										</view>
										<view class="four-two">
											<view class="four-two-one" @click.stop="lookimg(item.Images, 2)">
												<image class="simg"
													:src="JSON.parse(item.Images)[2] + '?x-oss-process=image/resize,m_fill,w_1500'"
													mode="aspectFill" />
											</view>
											<view class="four-two-two" @click.stop="lookimg(item.Images, 3)">
												<image class="simg"
													:src="JSON.parse(item.Images)[3] + '?x-oss-process=image/resize,m_fill,w_1500'"
													mode="aspectFill" />
											</view>
										</view>
									</view>
									<view class="five" v-else>
										<view class="five-one" v-for="(imgs, index) in JSON.parse(item.Images)"
											:key="index">
											<image @click.stop="lookimg(item.Images, index)"
												:src="imgs + '?x-oss-process=image/resize,m_fill,w_1500'"
												mode="aspectFill" />
										</view>
									</view>
								</view>
								<view class="video_box" v-else @click.stop="">
									<video :src="JSON.parse(item.Images)[0]"
										:poster="JSON.parse(item.Images)[0] + '?x-oss-process=video/snapshot,t_1,m_fast,ar_auto'"></video>
								</view>
							</view>

							<view class="all-list">
								<view class="upvote">
									<view class="zan-time">
										{{ item.City ? item.City : '' }}
									</view>
									<view class="zan-review">
										<view class="zan" @click="zan(item.ID)">
											<uni-icons type="heart" size="24" color="#9b9b9b"
												v-if="item.IsMyZAN == 0"></uni-icons>
											<uni-icons type="heart-filled" size="24" color="#ef4034" v-else></uni-icons>
											<text>{{ item.CommunityZAN.length > 0 ? item.CommunityZAN.length : '' }}</text>
										</view>
										<!-- <view class="zan" @click="open_gift(item)">
											<uni-icons type="gift" size="24" color="#9b9b9b"
												v-if="item.IsSendGift == 0"></uni-icons>
											<uni-icons type="gift-filled" size="24" color="#ef4034" v-else></uni-icons>
											<text>{{ item.TotalGiftNum > 0 ? item.TotalGiftNum : '' }}</text>
										</view> -->
										<view class="zan" @click="tocommit(item.ID, 0)">
											<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17114182173691488.png" mode="aspectFill"></image>
											<!-- <uni-icons type="chatbubble" size="24" color="#9b9b9b"></uni-icons> -->
											<text>{{ item.CommunityComments.length > 0 ? item.CommunityComments.length : '' }}</text>
										</view>
										<view class="c">
											<!-- #ifdef MP-WEIXIN -->
											<button hover-class="none" open-type="share" :data-id="item.ID">
												<image
													src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1717484310589825.png">
												</image>
											</button>
											<!-- #endif -->
											<!-- #ifdef APP-PLUS -->
											<button hover-class="none" @click="app_share(item)">
												<image
													src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1717484310589825.png">
												</image>
											</button>
											<!-- #endif -->
										</view>
									</view>

								</view>


								<view class="review-list" v-if="item.CommunityComments.length > 0">
									<view class="list" v-for="(review, c_index) in item.CommunityComments"
										:key="review.ID">
										<view class="content" @click="comment_edit(index, c_index,)"
											v-if="review.ReplyID > 0">
											<text>{{ review.Name ? $util.entitiesToUtf16(review.Name) : '' }} 回复 {{ review.Pre_Name ? $util.entitiesToUtf16(review.Pre_Name) : '' }}:</text>{{ review.Content ? $util.entitiesToUtf16(review.Content) : '' }}
										</view>
										<view class="content" @click="comment_edit(index, c_index, review.Name)" v-else>
											<text>{{ review.Name ? $util.entitiesToUtf16(review.Name) : '' }}:</text>{{ review.Content ? $util.entitiesToUtf16(review.Content) : '' }}
										</view>
									</view>
								</view>
							</view>

							<view class="load" v-if="bottom_load">
								<text>正在加载</text>
								<u-loading-icon mode="circle" inactive-color="#fff" vertical></u-loading-icon>
							</view>
						</view>
						<view style="height: 200rpx;"></view>
					</view>
				</block>
				<block v-else>
					<text style="width:100%;text-align:center;">暂无动态...</text>
				</block>
				<!-- #ifdef MP-WEIXIN -->
			</x-scroll>
			<!-- #endif -->
		</block>

		<view class="add_btn" v-if="IsCommunity" @click="release">发布</view>
		<!-- 赠送礼物弹出层 -->
		<uni-popup ref="gift" type="center">
			<view class="x-popup">
				<view class="popup-title">赠送对方礼物
					<view class="xiaoju-popup-close" @click="$refs['gift'].close()">关闭</view>
				</view>
				<scroll-view class="popup-wrap" scroll-y="true" :show-crollbar="true" scroll-with-animation="true">
					<view class="x-list">
						<view v-for="(l, i) in gift" :key="i" @click="gift_active = i" class="list-cell"
							:class="{ 'list-active': i == gift_active }">
							<image class="list-icon" :src="l.Icon ? l.Icon : '/static/img/icon_bbt.png'" mode=""></image>
							<view v-if="i != gift_active" class="list-name"> {{ l.Name }} </view>
							<view class="list-price"> ￥{{ l.Price }} </view>
							<!-- <view v-if="i==gift_active" @click="giftEvent" class="list-btn"> 赠送 </view> -->

							<view v-if="i == gift_active" class="list-btn">
								<view class="add" @click="gift_num_reduce(l)">-</view>
								<view class="count">
									<input type="text" v-model="l.Num" />
								</view>
								<view class="add" @click="gift_num_plus(l)">+</view>

							</view>
						</view>
					</view>
				</scroll-view>
				<view class="popup-btn" @click="giftEvent">赠送</view>
			</view>
		</uni-popup>

		<!-- APP 分享 转发好友、朋友圈 -->
		<!-- #ifdef APP-PLUS -->
		<uni-popup ref="share" type="bottom">
			<view class="x-share">
				<view class="item" @click="shareWX()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/wx_logo.png"></image>
					<span>转发好友</span>
				</view>
				<view class="item" @click="sharePYQ()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/icon/pyq_logo.png"></image>
					<span>分享朋友圈</span>
				</view>
			</view>
		</uni-popup>
		<!-- #endif -->


		<inputBox :commit="commit" @submit="submit"></inputBox>
	</view>
</template>

<script>
import inputBox from "./components/input-box.vue";
export default {
	components: {
		inputBox,
	},
	data() {
		return {
			toggle: true,
			commit: false,
			user: {},
			load: false,
			bottom_load: false,
			oldList: [],
			list: [],
			shareTitle: "动魅", //转发的标题
			sharePath: "", //转发的页面
			shareImg: "",

			PageIndex: 1,
			PageSize: 15,
			CompanyID: 6002,
			isMore: true,
			cz_price: 100,
			zan_id: 0,
			IsCommunity: false,
			review_id: 0,
			comment_id: 0,
			scrollTop: 0, // 数据绑定，用于保存滚动位置
			screenHeight: 0, //屏幕高度
			isLoading: true, //防止频繁触发
			bottomDistinct: 200, //距离底部多少像素时触发

			gift: [], //礼物数组
			gift_active: -1, //当前选中礼物
			sel_community: '',

			action_list: '',
			repname: '',
		};
	},
	methods: {
		onexpand() {
			this.toggle = !this.toggle;
		},
		//发布
		release() {
			let _this = this
			if (_this.user.IsAuth == 0) {
				uni.showModal({
					title: '温馨提示',
					content: '您还没注册，请先注册',
					confirmText: '确定',
					success: function (rs) {
						if (rs.confirm) {
							_this.nav_to('/pages/start/start2')
							return
						} else if (rs.cancel) {

						}
					}
				});
			} else {
				this.nav_to('/pages/dynamic/dynamic_add')
			}

		},
		app_share(item) {
			this.sel_community = item
			this.$refs.share.open()
		},
		//礼数数减
		gift_num_reduce(l) {

			if (l.Num >= 1) {
				l.Num--
			}
		},
		//礼物数加
		gift_num_plus(l) {
			if (l.Num >= 0) {
				l.Num++
			}
		},
		async getLatestMessageCount() {
			// 发送请求获取最新消息数量
			const response = await this.$api.post('/Community/TotalNum');

			// 解析响应数据，获取消息数量
			const latestCount = response.data;

			uni.setStorageSync('messageCount', latestCount);
		},

		// 评论
		tocommit(ID, C_ID) {
			let _this = this;
			if (_this.user.IsAuth == 0) {
				uni.showModal({
					title: '温馨提示',
					content: '您还没注册，请先注册',
					confirmText: '确定',
					success: function (rs) {
						if (rs.confirm) {
							_this.nav_to('/pages/start/start2')
							return
						} else if (rs.cancel) {

						}
					}
				});
				return
			}
			// console.log(id);
			this.commit = !this.commit
			this.review_id = ID
			this.comment_id = C_ID

			//console.log('评论ID', this.review_id);
		},
		async delReview(index, c_index) {

			const item = this.list[index].CommunityComments[c_index];

			let res = await this.$api.post('/Community/DeletePage', {
				ID: item.ID,
			});
			this.$pv.msg('删除成功')

			this.list[index].CommunityComments.splice(c_index, 1);

		},
		async submit(val) {
			if (val != '') {
				// console.log(val);
				let utf16 = this.$util.utf16ToEntities(val).slice(0, 200);
				let res = await this.$api.post('/Community/UserComment', {
					CommunityID: this.review_id,
					Content: utf16,
					CompanyID: 6002,
					ReplyID: this.comment_id
				});
				console.log(JSON.parse(res.data));
				if (JSON.stringify(res.data) == 'true') {

					this.list.forEach((item, index) => {
						if (item.ID == this.review_id) {
							item.CommunityComments.push({
								UserID: uni.getStorageSync('user').UserID,
								HeadImgUrl: uni.getStorageSync('user').HeadImgUrl,
								Name: uni.getStorageSync('user').Name,
								Content: val,
								CreateTime: new Date(),
								ReplyID: this.comment_id,
								Pre_Name: this.repname,
							})
							this.list.splice(index, 1, item);
						}
					});

					this.commit = !this.commit;

				} else {
					this.$pv.msg('平台审核中')
				}
			} else {
				this.$pv.msg('评论不能为空')
			}
		},
		closeDh() {
			this.$refs.duihuan.close();
		},
		openDh() {
			this.$refs.duihuan.open();
		},
		comment_edit(index, c_index, name = '') {
			let _this = this;
			_this.repname = name;
			const user = uni.getStorageSync('user');

			const item = this.list[index].CommunityComments[c_index];

			if (user.ID == item.UserID) {
				uni.showActionSheet({
					itemList: ['删除评论'],
					success: function (res) {
						if (res.tapIndex == 0) {
							_this.delReview(index, c_index);

							return;
						}
					},
					fail: function (res) {
						;
					}
				});
			} else {
				//直接回复
				this.tocommit(item.CommunityID, item.ID);
			}

		},

		async init() {
			this.PageIndex = 1;
			this.oldList = [];

			await this.getList();


			this.load = true;
		},
		async getList() {
			let res = await this.$api.post('Community/PageList', {
				PageIndex: this.PageIndex,
				PageSize: this.PageSize,
				CompanyID: this.CompanyID
			});


			this.oldList = this.oldList.concat(res.data);
			this.list = JSON.parse(JSON.stringify(this.oldList));
			this.isMore = Array.isArray(res.data) && res.data.length >= this.PageSize;
			//console.log(res.data.length >= this.PageSize);

			return true;
		},
		open_detail(id) {
			this.nav_to('/pages/dynamic/detail?id=' + id);
		},
		// 获取礼物列表
		async GetGift() {
			let res = await this.$api.post('Friend/GetGift');
			this.gift = res.data || [];
		},
		async getAction() {
			let res = await this.$api.post('Action/Running', {
				ActType: '每周挑战'
			});

			this.action_list = res.data || [];
		},
		open_gift(item) {
			let _this = this;
			if (_this.user.IsAuth == 0) {
				uni.showModal({
					title: '温馨提示',
					content: '您还没注册，请先注册',
					confirmText: '确定',
					success: function (rs) {
						if (rs.confirm) {
							_this.nav_to('/pages/start/start2')
							return
						} else if (rs.cancel) {

						}
					}
				});
			}
			this.sel_community = item;
			// #ifdef APP
			uni.navigateTo({
				url: '/pages/dynamic/community_gift?item=' + JSON.stringify(item)
			})
			// #endif
			// #ifndef APP
			this.$refs['gift'].open()
			// #endif
		},
		// 赠送礼物的相关逻辑
		async giftEvent() {

			// 当前选中礼物
			const l = this.gift[this.gift_active]

			const gift_s_price = l.Price;
			const gift_price = l.Price * l.Num;


			const MessageId = Math.random().toString().substr(2, 10);

			let res_gift = await this.$api.post('Friend/SendGift', {
				Price: gift_price,
				GiftID: l.ID,
				GiftName: l.Name,
				GiftQty: l.Num,
				ToUserID: this.sel_community.UserID,
				EventID: this.sel_community.ID,
				SendType: '球友圈赠送',
				MessageId: MessageId
			});


			// 支付请求
			let pres = await this.$api.post('Payment/PayV2', {
				total_fee: gift_price,
				EventType: '赠送礼物',
				EventID: JSON.stringify(res_gift.data),
				body: l.Name,
				// #ifdef MP-WEIXIN
				PayChannel: "weixin",
				// #endif
				// #ifdef APP
				PayChannel: "app"
				// #endif
			});
			// 已余额支付成功
			if (pres.data == 0) {
				// 提示赠送成功
				this.$pv.msg('礼物赠送成功');
				// 关闭礼物弹出层
				this.$refs['gift'].close()

				this.list.forEach((item, index) => {
					if (item.ID == this.sel_community.ID) {
						item.IsSendGift = 1;
						item.TotalGiftNum = item.TotalGiftNum + l.Num;
						this.list.splice(index, 1, item);
					}
				});

				//组装消息实体
				const n_msg = {
					Price: gift_price,
					Name: l.Name,
					OutMessageId: MessageId,
					Done: 0,
					Icon: l.Icon
				}
				// 自定义对话内容(自定义消息,JSON(消息),id,判断条件)
				this.$im.sendMessage(200, JSON.stringify(n_msg), this.sel_community.UserID + '', 12).then(res => {
					console.log(JSON.stringify(n_msg));
				});

				return;
			}

			// 支付成功返回的内容
			let payObj = JSON.parse(pres.data);
			let _this = this;
			// 调用uni支付API
			uni.requestPayment({
				// 服务提供商
				provider: 'wxpay',
				// #ifdef APP
				orderInfo: payObj,
				// #endif
				// #ifdef MP-WEIXIN
				timeStamp: payObj.timeStamp,
				nonceStr: payObj.nonceStr,
				package: payObj.package,
				signType: payObj.signType,
				paySign: payObj.paySign,
				// #endif
				success(res) {

					// 关闭礼物弹出层
					_this.$refs['gift'].close();

					_this.$pv.msg('礼物赠送成功');

					_this.list.forEach((item, index) => {
						if (item.ID == _this.sel_community.ID) {
							item.IsSendGift = 1;
							item.TotalGiftNum = item.TotalGiftNum + l.Num;
							// item.Gifts.push({
							// 	UserID: uni.getStorageSync('user').UserID
							// })
							_this.list.splice(index, 1, item);
						}
					});


					//组装消息实体
					const n_msg = {
						Price: gift_price,
						Name: l.Name,
						OutMessageId: MessageId,
						Done: 0,
						Icon: l.Icon
					}
					// 自定义对话内容(自定义消息,JSON(消息),id,判断条件)
					_this.$im.sendMessage(200, JSON.stringify(n_msg), _this.sel_community.UserID + '', 12)
						.then(res => {
							console.log(JSON.stringify(n_msg));

						});

				},
				fail(err) {
					_this.$pv.msg('您已取消支付');
				}
			});
		},
		async delete(id) {
			let _this = this;
			let index = this.list.findIndex((item) => item.ID === id)

			uni.showModal({
				title: '温馨提示',
				content: '您确定要删除这条动态吗?',
				confirmText: "删除",
				success: async function (res) {
					if (res.confirm) {
						let res = await _this.$api.post('/Community/Delete', {
							ID: id
						});
						_this.list.splice(index, 1)
					} else if (res.cancel) {

					}
				}
			});
		},
		// 赞
		async zan(zid) {
			let _this = this;
			if (_this.user.IsAuth == 0) {
				uni.showModal({
					title: '温馨提示',
					content: '您还没注册，请先注册',
					confirmText: '确定',
					success: function (rs) {
						if (rs.confirm) {
							_this.nav_to('/pages/start/start2')
							return
						} else if (rs.cancel) {

						}
					}
				});
				return
			}
			this.zan_id = zid;

			//============暂时去掉点赞收费内容  update  2023-10-11
			//先判断用户余额是否足够
			//不够则弹出充值页面
			// let ba = await this.$api.post('/SaleChannel/SaleChannelDetail', {
			// 	CompanyID: 6002
			// });
			// if (ba.data) {
			// 	if (ba.data.Balance < 1) {
			// 		this.$refs.duihuan.open();
			// 		return;
			// 	}
			// }

			let res = await this.$api.post('Community/ZAN', {
				ID: zid
			});

			if (JSON.stringify(res.data) == 'true') {
				this.$pv.msg('点赞成功');

				this.list.forEach((item, index) => {
					if (item.ID == zid) {
						item.IsMyZAN = 1;
						item.CommunityZAN.push({
							UserID: uni.getStorageSync('user').UserID,
							HeadImgUrl: uni.getStorageSync('user')
								.HeadImgUrl
						})
						this.list.splice(index, 1, item);
					}
				});


			} else {
				this.$pv.msg(res.message);
			}
		},

		//下拉刷新
		async onRefresh() {
			this.PageIndex = 1;
			this.oldList = [];
			await this.getList()
		},

		//滚动到底部触发
		async scrolltolower() {
			if (this.isMore) {

				this.bottom_load = true;

				this.PageIndex++;
				this.getList();

				this.bottom_load = false;
			}

		},
		lookimg(url, index) {
			let arr = JSON.parse(url);
			uni.previewImage({
				urls: arr,
				current: index,
			})
		},
		onPageScroll(e) {
			const {
				scrollTop //滚动条距离页面顶部的像素
			} = e;
			//获取SelectorQuery 对象实例
			const query = uni.createSelectorQuery().in(this);
			//为listArea节点绑定查询请求
			query.select('#listArea').boundingClientRect(data => {
				let {
					height //listArea节点的高度
				} = data;
				//如果设置的事件触发距离 大于等于 (节点的高度-屏幕高度-滚动条到顶部的距离)
				if (this.bottomDistinct >= height - this.screenHeight - scrollTop && this.isLoading) {
					//模拟异步加载数据
					// this.PageIndex++
					this.isLoading = false;
					if (this.isMore) {
						this.PageIndex++;
						this.getList();
					}
					setTimeout(() => {
						this.isLoading = true; // 一定时间后恢复标识变量为 true，允许再次触发
					}, 1000); // 
				}
			}).exec();
		},
		sharePYQ() {
			const user = uni.getStorageSync("user");

			const pid = user.UserID;
			let id = this.sel_community.ID;
			let _title = this.sel_community.Content ? this.sel_community.Content : '发现精彩的好友动态，赶快来围观吧'

			const BaseUrl = "http://h5.golf.xiaojusmart.com/#/";
			const paseUrl = `pages/H5/cm_detail?id=${id}&pid=${pid}`;
			let shareUrl = BaseUrl + paseUrl;

			uni.share({
				provider: "weixin",
				scene: "WXSceneTimeline",
				type: 0,
				href: shareUrl,
				title: '【动魅朋友圈】' + _title,
				imageUrl: JSON.parse(this.sel_community.Images)[0],
				success: (res) => {
					this.$refs.share.close()
				},
				fail(err) {
					console.log("fail:" + JSON.stringify(err));
				}
			});



		},
		shareWX() {
			const user = uni.getStorageSync("user");

			const pid = user.UserID;
			let id = this.sel_community.ID;
			let _title = this.sel_community.Content ? this.sel_community.Content : '发现精彩的好友动态，赶快来围观吧'

			const BaseUrl = "http://h5.golf.xiaojusmart.com/#/";
			const paseUrl = `pages/H5/cm_detail?id=${id}&pid=${pid}`;
			let sharUrl = BaseUrl + paseUrl;
			let _this = this;
			uni.share({
				provider: "weixin",
				scene: "WXSceneSession",
				type: 5,
				imageUrl: JSON.parse(this.sel_community.Images)[0],
				title: '【动魅朋友圈】' + _title,
				miniProgram: {
					id: 'gh_ff1a33213d99',
					path: 'pages/dynamic/detail?id=' + id + '&pid=' + pid,
					type: 0,
					webUrl: sharUrl
				},
				success: (res) => {
					this.$refs.share.close()
				},
				fail(err) {
					console.log("fail:" + JSON.stringify(err));
				}
			});

			// this.is_app_share_show = false;
		}
	},
	async onLoad(args) {

		let res = await this.$api.post('Company/GetCompanyInfo', {
			ID: 6002,
		});

		if (res.data) {
			if (res.data.IsCommunity == 1)
				this.IsCommunity = true;
			else
				this.IsCommunity = false;
		}

		// 获取礼物列表
		this.GetGift();

		this.getAction();

		await this.$api.post('/Common/Add_ViewPath', {
			Path: 'community',
			Platform: uni.getStorageSync('platform')
		});
		uni.$on('giftEvent', res => {
			this.$pv.msg('礼物赠送成功');
			this.list.forEach((item, index) => {
				if (item.ID == this.sel_community.ID) {
					item.IsSendGift = 1;
					item.TotalGiftNum = item.TotalGiftNum + res.Num;
					this.list.splice(index, 1, item);
				}
			});

			//组装消息实体
			const n_msg = {
				Price: res.gift_price,
				Name: res.Name,
				OutMessageId: res.MessageId,
				Done: 0,
				Icon: res.Icon
			}
			// 自定义对话内容(自定义消息,JSON(消息),id,判断条件)
			this.$im.sendMessage(200, JSON.stringify(n_msg), this.sel_community.UserID + '09', 12).then(res => {
				console.log(JSON.stringify(n_msg));
			});
		})
	},
	onShow() {
		this.$store.dispatch('getMyNum')
		this.user = uni.getStorageSync('user');

		this.init();

		//  this.init();
		this.screenHeight = uni.getSystemInfoSync().screenHeight;

		this.getLatestMessageCount();



	},
	onPullDownRefresh() {
		this.init()

		uni.stopPullDownRefresh()
	},
	onShareAppMessage(e) { //发送给朋友
		// let trendsIndex = e.target.dataset.trendsIndex;
		if (e.target) {
			let trendsId = e.target.dataset.id;
			if (trendsId > 0) {
				let o = this.list.find(item => item.ID == trendsId);
				let pid = uni.getStorageSync('user').UserID;

				console.log('pages/dynamic/detail?pid=' + pid + '&id=' + trendsId);

				this.shareTitle = '动魅精彩瞬间，您不容错过';
				this.sharePath = 'pages/dynamic/detail?pid=' + pid + '&id=' + trendsId;
				this.shareImg = o.IsVideo == 1 ? JSON.parse(o.Images)[0] +
					'?x-oss-process=video/snapshot,t_1,m_fast,ar_auto' :
					JSON.parse(o.Images)[0]
				return {
					title: this.shareTitle,
					path: this.sharePath,
					imageUrl: this.shareImg
				}
			}
		} else {
			let pid = uni.getStorageSync('user').UserID;

			this.shareTitle = '动魅精彩瞬间，您不容错过';
			this.sharePath = `pages/tab/community?pid=` + pid;

			return {
				title: this.shareTitle,
				path: this.sharePath
			}
		}

	},
};
</script>

<style lang="scss">
page {
	background-color: #f6f6f6;
}

.describe {
	// margin-top: 10rpx;
	// min-height: 78rpx;
	position: relative;
	// margin-bottom: 15rpx;
	// padding: 0 32rpx;
	box-sizing: border-box;
	margin-bottom: 16rpx;
}

.describetext {
	width: 86%;
	// display: -webkit-box;
	// -webkit-box-orient: vertical;
	// -webkit-line-clamp: 2;
	// text-overflow: ellipsis;
	// overflow: hidden;
	font-size: 28rpx;
}

.describetext2 {
	width: 90%;
	font-size: 28rpx;
}

.expand {
	position: absolute;
	right: 20rpx;
	top: 35rpx;
	height: 40rpx;
	display: flex;
	align-items: center;
}

.retract {
	position: absolute;
	right: 27rpx;
	bottom: 0rpx;
	display: flex;
	align-items: center;
	text-align: center;
}

.expandtext {
	font-size: 28rpx;
}

.expandimg {
	width: 20rpx;
	height: 16rpx;
	vertical-align: middle;
}

.trends {
	height: 100vh;
	overflow: hidden;

	.week_share {
		display: flex;
		background-color: #f4f4f4;
		border: #848484 1rpx solid;
		width: 95%;
		margin: 10rpx auto;
		padding: 10rpx;

		image {
			width: 100%;
			height: 100rpx;
		}

		.week_act {
			color: #ffff00;
			padding: 10rpx;
			width: 70%;
			flex-direction: row;
			display: flex;

			.title {
				color: #2f2f00;
				font-size: 36rpx;
				font-weight: bold;
			}

			.desc {
				color: #81807f;
				font-size: 28rpx;
			}
		}

		.title_right {
			font-size: 32rpx;
			justify-content: center;
			justify-items: center;
			position: absolute;
			right: 40rpx;
			background-color: #FF9800;
			border-radius: 10rpx;
			padding: 12rpx;
			color: #fff;
		}

		.act {
			line-height: 40rpx;
			color: #55aaff;
		}
	}

	.item {
		background: #fff;
		border-radius: 16rpx;
		margin: 24rpx;
		padding: 20rpx;

		.item_hd {
			height: 100rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 0 20rpx;

			.left {
				height: 100rpx;
				display: flex;
				align-items: center;
			}

			.cover {
				width: 80rpx;
				height: 80rpx;
				border-radius: 50rpx;
				border: 1px solid #7b7b7b;
				overflow: hidden;
				margin-right: 16rpx;

				image {
					height: 100%;
					width: 100%;
				}
			}

			.item_name {
				color: #333;
				font-size: 32rpx !important;
				font-weight: 600;
			}


		}

		.item_bd {
			padding: 0 8rpx;
    		box-sizing: border-box;
			.simg {
				display: block;
				//smax-height: 750rpx;
			}

			.conrem {
				padding: 0 32rpx;
				box-sizing: border-box;
			}

			.order_div {
				width: 100%;
				margin-top: 10rpx;
				height: 80rpx;
				line-height: 80rpx;
			}
		}
	}
}

.add_btn {
	position: fixed;
	right: 32rpx;
	bottom: 170rpx;
	width: 96rpx;
	height: 96rpx;
	z-index: 999;
	text-align: center;
	align-items: center;
	// background: linear-gradient(180deg, #FEF0BC 0%, #B98B51 100%);
	// box-shadow: 0px 4rpx 6rpx 0px rgba(106, 84, 53, 0.4);
	background: #0d0d0d;
	color: #fff;
	line-height: 96rpx;
	border-radius: 100rpx;
}

.order_btn {
	width: 100%;
	height: 70rpx;
	text-align: center;
	align-items: center;
	background: linear-gradient(180deg, #FEF0BC 0%, #B98B51 100%);
	box-shadow: 0px 4rpx 6rpx 0px rgba(106, 84, 53, 0.4);
	color: #4C310C;
	line-height: 70rpx;
	border-radius: 10rpx;
}

.mt20 {
	// margin-top: 20rpx;

	.one {
		display: flex;
		width: 100%;
		//height: 400rpx;

		image {
			width: 70%;
		}
	}

	.two {
		display: flex;
		justify-content: space-between;

		.two-one {
			width: 40%;
			height: 480rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.two-two {
			width: 59.5%;
			height: 480rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}

	.three {
		display: flex;
		justify-content: space-between;

		.three-one {
			width: 49.5%;
			height: 480rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.three-two {
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			width: 49.5%;
			height: 480rpx;

			image {
				width: 100%;
				height: 49.5%;
			}
		}
	}

	.four {
		display: flex;
		flex-direction: column;

		.four-one {
			display: flex;
			justify-content: space-between;

			.four-one-one {
				width: 40%;
				height: 300rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.four-one-two {
				width: 59.5%;
				height: 300rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}

		.four-two {
			display: flex;
			justify-content: space-between;

			.four-two-one {
				width: 59.5%;
				height: 300rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.four-two-two {
				width: 40%;
				height: 300rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}
	}

	.five {
		display: flex;
		flex-wrap: wrap;
		width: 100%;

		.five-one {
			width: 206rpx;
			height: 206rpx;
			margin-bottom: 8rpx;
			margin-right: 4rpx;
			margin-left: 4rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}
}

.video_box {
	height: 500rpx;
	position: relative;
	z-index: 2;

	video {
		width: 50%;
		height: 100%;
	}
}

.all-list {
	width: 100%;

	.upvote {
		display: flex;
		justify-content: space-between;
		align-items: center;
		// margin: 10rpx 20rpx;
		// margin-top: 50rpx;
		// padding-bottom: 15rpx;
		margin: 24rpx 0;
		.zan-time {
			font-size: 26rpx;
			color: #999999;
		}

		.zan-review {
			display: flex;
			align-items: right;
			margin: 10rpx 0;
			height: 40rpx;

			image {
				padding-top: 26rpx;
				width: 48rpx;
				height: 48rpx;
			}

			.zan {
				margin-right: 26rpx;
				display: flex;
				align-items: center;
				image{
					padding-top: 0;
					width: 50rpx;
					height: 50rpx;
				}
				text {
					height: 40rpx !important;
					padding-left: 10rpx;
				}
			}

			button {
				display: flex;
				//height:50rpx !important;
				margin-top: -30rpx;
				background-color: unset;

				&::after {
					border: 0;
				}
			}
		}
	}

	.review-list {
		// display: flex;
		// flex-direction: column;
		/* margin: 20rpx 20rpx 20rpx; */
		// background-color: #F6F6F6;
		// padding: 10rpx 20rpx;
		// margin: 0 20rpx;
		width: 100%;

		.list {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			flex-wrap: wrap;
			// height: 45rpx;
			line-height: 45rpx;

			.content {
				margin-left: 24rpx;
				// font-weight: 700;
				font-size: 28rpx;
				color: #333333;
				padding-right: 20rpx;
				box-sizing: border-box;

				text {
					box-sizing: border-box;
					color: #5f698b;
					font-weight: 500;
					padding-right: 10rpx;
					font-size: 28rpx;
				}


			}

			.del {
				font-size: 12px;
				color: #576b95;
			}
		}
	}
}


.x-share {
	background-color: #ffffff;
	width: 750rpx;
	border-radius: 20rpx;
	padding: 40rpx 20rpx 80rpx;
	display: flex;
	box-sizing: border-box;

	.item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		background-color: #ffffff;

		image {
			width: 64rpx;
			height: 64rpx;
			margin-bottom: 10rpx;
		}

		span {
			color: #2e2e2e;
		}
	}

}


.x-popup {
	background-color: #ffffff;
	width: 650rpx;
	border-radius: 20rpx;
	padding-bottom: 20rpx;

	.popup-title {
		padding: 20rpx 0 10rpx;
		text-align: center;
		font-size: 32rpx;
		position: relative;
		color: #333;

		.xiaoju-popup-close {
			font-size: 24rpx;
			position: absolute;
			right: 50rpx;
			top: 10rpx;
			color: #333;
		}
	}

	.popup-wrap {
		max-height: 800rpx;
		min-height: 300rpx;
		padding-top: 10rpx;
		padding-bottom: 30rpx;

		.popup-cell {
			padding: 8rpx 40rpx;
			font-size: 30rpx;
			line-height: 44rpx;
		}
	}

	.popup-btn {
		margin: 0 auto;
		width: 200rpx;
		height: 60rpx;
		border-radius: 10rpx;
		color: #fff;
		font-size: 28rpx;
		letter-spacing: 2px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #FD4C61;
	}
}

.x-list {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	padding: 0 60rpx;

	.list-cell {
		width: 27%;
		height: 170rpx;
		border: 2rpx solid #fff;
		display: flex;
		align-items: center;
		flex-direction: column;
		padding: 5rpx 0rpx 10rpx;
		border-radius: 16rpx;
		position: relative;

		&.list-active {
			border-radius: 16rpx;
			border: 2rpx solid #70737C;
		}

		.list-btn {
			width: calc(100% + 4rpx);
			height: 52rpx;
			color: #fff;
			background: #FD4C61;
			border-radius: 0rpx 0rpx 16rpx 16rpx;
			position: absolute;
			bottom: -2rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 24rpx;


			.count {
				color: #fff;
				line-height: 60rpx !important;
				// margin-right: 5rpx;

				input {
					width: 40rpx;
					//border: #fff solid 1rpx;
				}
			}

			.add {

				display: flex;
				justify-content: center;
				align-items: center;
				/* border: 2rpx solid #ccc; */
				box-sizing: border-box;
				font-size: 52rpx;
				width: 75rpx;
				color: #fff;
			}
		}

		.list-icon {
			width: 80rpx;
			height: 80rpx;
		}

		.list-name {
			color: #333;
			font-size: 26rpx;
			margin-top: 8rpx;
		}

		.list-price {
			color: #333;
			font-size: 22rpx;
			margin-top: 5rpx;
		}
	}
}
</style>